<template>
	<view>
		<view>
			<view class="title">
				开房对抗
			</view>
			<view class="romid">
				<view>房间ID:</view>
				<input type="text">
			</view>
			<view>
				<cos-btn text="进入房间" @sure="enter"></cos-btn>
				<cos-btn text="进入房间" @sure="connect"></cos-btn>
			</view>
		</view>
	</view>
</template>

<script>
	import cosBtn from '../../components/cos-btn.vue'
	export default{
		components:{
			cosBtn
		},
		data(){
			return{
				romID: ''
			}
		},
		methods:{
			enter(){
				// if(this.romID === ''){
				// 	this.$toast('请输入房间ID')
				// 	return
				// }
				// uni.navigateTo({
				// 	url: './PKrom?id=' + this.romID
				// })
			},
			connect(){
				let roomId = uni.getStorageSync('roomId') || ''
				let query = `{"Method":"login", "Body": {"AppId": "${this.$store.state.user.keyid}", "AppKey": "www.zhiyuext.com", "Name": "${this.$store.state.user.nickname}", "Token": "${this.$store.state.user.token}", "Avatar": "${this.$store.state.user.userimg}"`
				if(roomId){
					query += `, "RoomId": "${roomId}"}}`
				}else{
					query += `}}`
				}
				console.log(query)
				query = encodeURIComponent(query)
				let url = `wss://game.insyte.cn/login?${query}`
				this.socket = uni.connectSocket({
					url,
					success:(res)=>{
						console.log(res)
					}
				})
				uni.onSocketOpen(function(data){
					console.log('连接了啦')
					console.log(data)
				})
				uni.onSocketMessage(function(data){
					console.log(data)
				})
				uni.onSocketClose((err)=>{
					console.log(this.socket)
					console.log('关闭啦')
					console.log(err)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pageWrap{
		box-sizing: border-box;
		width: 750rpx;
		padding: 0 30px;
		padding-top: 27px;
	}
	.title{
		text-align: center;
		font-weight: bold;
		font-size: 26px;
		color: #303030;
	}
	.romid{
		margin-top: 17px;
		font-size: 16px;
		color: #000000;
		input{
			width: 100%;
			border-bottom: 2px solid #999999;
		}
	}
</style>
